<template>
  <div class="layout-row plr15 pb15">
    <div class="layout-row flex3 mr15">
      <top class="ww100 hidden" ref="exposeRef" />
    </div>
    <div class="layout-col hidden flex1">
      <bottom-top class="flex1 mb15" />
      <div class="layout-col hidden flex2">
        <bottom-bottom class="flex1"/>
        <bottom-bottom2 class="flex1 mt15" v-if="!isNull(state.control)"/>
      </div>
    </div>
  </div>
</template>

<script lang="ts" setup>
import top from "@/views/async/chart/top";
import bottomTop from "@/views/async/monitor/leftBottom";
import bottomBottom from "@/views/async/monitor/centerBottom";
import bottomBottom2 from "@/views/async/chart/topLeft";
import scheduled from "@/utils/scheduled";
const { createScheduled } = scheduled();
const route = useRoute();
const { proxy }: any = getCurrentInstance();
const configStore = proxy.configStore();
const publicStore = proxy.publicStore();
const state = reactive({
  ...publicStore.$state,
  control: [],
});
let exposeRef = $ref()

onMounted(async () => {
  publicStore.form = route.query
  publicStore.form.timestamp = ''
  if(!proxy.isNull(route.query.alarm_time))  publicStore.status = 1
  init();
  createScheduled('chart', 2*1000, () => { if(publicStore.status == 0) init() })
});
 
watch(() => publicStore.status, async (val) => {
  if(val == 1) return
  if(val == 0) publicStore.form.timestamp = ''
  init(); 
},{ immediate: false, deep: true });

watch(() => publicStore.datetime, async (val) => {
  if(proxy.isNull(val)) return
  init();
},{ immediate: false, deep: true });

const init = async () => {
  if(proxy.isNull(publicStore.form.id)) return
  exposeRef.init()
  getAlarmList()
  getAlarmType()
  getControlList()
};

const getAlarmList = async() => {
  let query = {}
  console.log('datetime', publicStore.datetime)
  if(publicStore.status == 0){
    query = {"o": "o_sensor_alarm_log", "p": [publicStore.distributId, publicStore.form.id], "i": 8, s: 0, n: 20}
  }else{
    query = {"o": "o_sensor_alarm_log", "p": [publicStore.form.id, publicStore.datetime[0] + '', publicStore.datetime[1] + ''], "i": 10}
  }
  let params = {queryApi6: query}
  let res = await publicStore.post(params)
  publicStore._public.alarmList = proxy.isNull(res)? [] : res;
}

const getAlarmType = async() => {
  let start = ''
  let end = ''
  if(publicStore.status == 0){
    start = '1640966400000'
    end = new Date().getTime() + ''
  }else{
    start = publicStore.datetime[0]
    end = publicStore.datetime[1]
  }
  let query = {"o": "o_sensor_alarm_log", "p": [publicStore.form.id, start, end, publicStore.form.type], "i": 4}
  let params = {queryApi7: query}
  let res = await publicStore.post(params)
  res.forEach(v => {
    v.name = v.alarm_name
    v.value = parseInt(v.alarm_count)
  });
  publicStore._public.alarmType = res;
}

const getControlList = async() => {
  let query2 = {"o":"o_sensor_template_control_property","p":[publicStore.form.type]}
  let params2 = {queryApi8: query2}
  state.control = await publicStore.post(params2)
  if (proxy.isNull(state.control)) return 
  let query = {}
  if(publicStore.status == 0){
    query = {"o": "o_sensor_control_log", "p": [publicStore.distributId, publicStore.form.id], "i": 1, s: 0, n: 20}
  }else{
    query = {"o": "o_sensor_control_log", "p": [publicStore.distributId, publicStore.form.id, publicStore.datetime[0], publicStore.datetime[1]], "i": 4}
  }
  let params = {queryApi6: query}
  let res = await publicStore.post(params)
  publicStore._public.controlList = proxy.isNull(res)? [] : res;
}
</script>

<style lang="scss">

</style>
